<template>
  <el-menu-item v-if="!isSub" :index="props.item.path">{{ item.name }}</el-menu-item>
  <el-sub-menu v-else :index="props.item.path">
    <template #title>{{ item.name }}</template>
    <menu-temp v-for="item in props.item.children" :key="item.path" :item="item" />
  </el-sub-menu>
</template>

<script setup>
import { computed } from 'vue'
const props = defineProps({
  item: {
    type: Object,
    default: () => ({}),
  },
})

const isSub = computed(() => {
  return props.item.children && Array.isArray(props.item.children) && props.item.children.length > 0
})
</script>

<style lang="scss" scoped></style>
